﻿@model IEnumerable<Enter.Mvc.Mall.Model.Product.Property_Value>
@{
    ViewBag.Title = "publish";
    Layout = "~/Views/Shared/_MemberCenterLayout.cshtml";
}
@section Styles
{
    <link href="../../Content/themes/default/putgoodinfo.css" rel="stylesheet" type="text/css" />
}
<script>
    $(function () {
        var count = 0;
        $("#ul_color li.sku-item input").bind('change', function () {

            var trid = this.id.replace("prop-", "J_MapImg-");

            var trobj = $("#" + trid);

            if (this.checked == true) {
                trobj.show();
                count++;
            }
            else {
                trobj.hide();
                count--;
            }
            if (count == 0) {
                $("#J_SKUImgTable").hide();
            } else {
                $("#J_SKUImgTable").show();
            }
            creatTable();
        })

        $("#chkall-c").click(function () {

            if (this.checked == true) {
                count = $("#ul_color li.sku-item input").length;
                $("table#J_SKUImgTable,table#J_SKUImgTable tr ").show();
                $("#ul_color li.sku-item input").attr("checked", "true");
            } else {
                count = 0;
                $("table#J_SKUImgTable,table#J_SKUImgTable tr ").hide();
                $("#ul_color li.sku-item input").attr("checked", "");
            }
        })

        $(".sku-switchable input.J_Checkbox").click(function () {
            if (this.checked == true) {
                $(this).next().hide();
                $(this).next().next().show();
            } else {
                $(this).next().show();
                $(this).next().next().hide();
            }
            creatTable();
        })

    });

    function creatTable() {

        var colorcount = $("#ul_color").length;
        var sizecount = $(".sku-switchable").length
       
        if (colorcount > 0 && sizecount == 0) {
            var color = $("#ul_color li.sku-item input:checked");
             var str = "";
             if (color.length > 0) {
                 $("#J_SKUMapContainer").show();
                 $("#J_SKUMapContainer table thead").html('<tr><th class="J_Map_0">颜色分类</th><th>价格 <em>*</em> </th><th>数量 <em>*</em></th></tr>'); 
                 for (var i = 0; i < color.length; i++) {
                     var obj = color[i];
                     var color_Value = obj.value;

                     var trid = color_Value.replace(":", "-");

                     var MapPrice = $("#SalePRICE").val();
                     var MapQuantity = "";

                     if ($("#" + trid).length > 0) {
                         MapPrice = $("#p-" + trid).val();
                         MapQuantity = $("#q-" + trid).val();
                     }
                     str += '<tr id="' + trid + '">';
                    
                         str += ' <td class="tile" rowspan="1"> <i class="color-lump" style="background-color: #' + $(obj).attr("data-color") + ';"></i><span class="J_Map_1627207-3232483">' + $(obj).attr("data-thumb") + '</span></td>'
                     

                     str += ' <td class="price">';
                     str += ' <input type="hidden" value="0" name="stock-' + color_Value + ';' + size_Value + '">';
                     str += '<input class="J_MapPrice text" id="p-' + trid + '" type="text" value="' + MapPrice + '" name="p-' + color_Value + '" data-type="price">';
                     str += ' </td>';
                     str += '<td class="quantity">';
                     str += '<input class="J_MapQuantity text" id="q-' + trid + '" onchange="TotalQuantity()" type="text" value="' + MapQuantity + '" name="q-' + color_Value + '" data-type="quantity" maxlength="6">';
                     str += '</td> '; str += '</tr>';
                 }
                 $("#J_SKUMapContainer table tbody").html('');
                 $("#J_SKUMapContainer table tbody").append(str);
             }
             else {
                 $("#J_SKUMapContainer table tbody").html('');
             }
         } else if (colorcount == 0 && sizecount > 0) {
             var size = $(".sku-switchable input.J_Checkbox:checked");
             var str = "";
             if (size.length > 0) {
                 $("#J_SKUMapContainer").show();
                 $("#J_SKUMapContainer table thead").html('<tr><th class="J_Map_0">尺码 </th><th>价格 <em>*</em> </th><th>数量 <em>*</em></th></tr>');

                 for (var j = 0; j < size.length; j++) {
                     var sizeobj = size[j];
                     var size_Value = sizeobj.value;
                     var trid =  size_Value.replace(":", "-");

                     var MapPrice = $("#SalePRICE").val();
                     var MapQuantity = "";

                     if ($("#" + trid).length > 0) {
                         MapPrice = $("#p-" + trid).val();
                         MapQuantity = $("#q-" + trid).val();
                     }
                     str += '<tr id="' + trid + '">';
                    
                     str += '<td rowspan="1"><span class="J_Map_20509-28381">' + $(sizeobj).attr("data-thumb") + '</span></td>';
                     str += ' <td class="price">';
                     str += ' <input type="hidden" value="0" name="stock-' + size_Value + '">';
                     str += '<input class="J_MapPrice text" id="p-' + trid + '" type="text" value="' + MapPrice + '" name="p-' + size_Value + '" data-type="price">';
                     str += ' </td>';
                     str += '<td class="quantity">';
                     str += '<input class="J_MapQuantity text" id="q-' + trid + '" onchange="TotalQuantity()" type="text" value="' + MapQuantity + '" name="q-' + size_Value + '" data-type="quantity" maxlength="6">';
                     str += '</td> '; str += '</tr>';
                  
                 }   $("#J_SKUMapContainer table tbody").html('');
                     $("#J_SKUMapContainer table tbody").append(str);
            } else {
                 $("#J_SKUMapContainer").hide();
                 $("#J_SKUMapContainer table tbody").html('');
             }
         } 
         else if (colorcount > 0 && sizecount > 0) {
       
            var color = $("#ul_color li.sku-item input:checked");

            var size = $(".sku-switchable input.J_Checkbox:checked");

            var str = "";
            if (color.length > 0 && size.length > 0) {
                $("#J_SKUMapContainer").show();
                $("#J_SKUMapContainer table thead").html('<tr><th class="J_Map_0">颜色分类</th><th class="J_Map_0">尺码 </th><th>价格 <em>*</em> </th><th>数量 <em>*</em></th></tr>'); 
                for (var i = 0; i < color.length; i++) {

                    var obj = color[i];
                    var color_Value = obj.value;

                    for (var j = 0; j < size.length; j++) {
                        var sizeobj = size[j];
                        var size_Value = sizeobj.value;
                        var trid = color_Value.replace(":", "-") + '_' + size_Value.replace(":", "-");

                        var MapPrice = $("#SalePRICE").val();
                        var MapQuantity = "";

                        if ($("#" + trid).length > 0) {
                            MapPrice = $("#p-" + trid).val();
                            MapQuantity = $("#q-" + trid).val();
                        }
                        str += '<tr id="' + trid + '">';
                        if (j == 0) {
                            str += ' <td class="tile" rowspan="' + size.length + '"> <i class="color-lump" style="background-color: #' + $(obj).attr("data-color") + ';"></i><span class="J_Map_1627207-3232483">' + $(obj).attr("data-thumb") + '</span></td>'
                        }
                        str += '<td rowspan="1"><span class="J_Map_20509-28381">' + $(sizeobj).attr("data-thumb") + '</span></td>';
                        str += ' <td class="price">';
                        str += ' <input type="hidden" value="0" name="stock-' + color_Value + ';' + size_Value + '">';
                        str += '<input class="J_MapPrice text" id="p-' + trid + '" type="text" value="' + MapPrice + '" name="p-' + color_Value + '-' + size_Value + '" data-type="price">';
                        str += ' </td>';
                        str += '<td class="quantity">';
                        str += '<input class="J_MapQuantity text" id="q-' + trid + '" onchange="TotalQuantity()" type="text" value="' + MapQuantity + '" name="q-' + color_Value + '-' + size_Value + '" data-type="quantity" maxlength="6">';
                        str += '</td> '; str += '</tr>';
                    }
                }
                $("#J_SKUMapContainer table tbody").html('');
                $("#J_SKUMapContainer table tbody").append(str);
            } else if (color.length == 0 || size.length == 0) {
                $("#J_SKUMapContainer").hide();
                $("#J_SKUMapContainer table tbody").html('');
            }
        }

    }

    function TotalQuantity() {

        var Quantity = $(".J_MapQuantity");

        var count = 0;
        for (var i = 0; i < Quantity.length; i++) {
            var q = $(Quantity[i]).val();

            if (!isNaN(q) && q != "") {
                count += parseInt(q);
            }
        }
        $("#quantityId").val(count);
    }

    function fromValidator() {

        $.post("/Auction/AddPrpductForm", $("#AddPrpductForm").serialize(), function (data) {
            // if (data.ResultCode == "00") {
            //                window.location.href = "/User/RegisterSuccess";
            //            } else {
            //                $("#divMsg").html(data.ResultMsg);
            //                ValidateCode_onClick();

            //            }

        }, "json");


    }
</script>

<div class="main pageWidth pb">
    <div id="Content" class="grid-c">
    
        <div id="item-publish" class="box">
        <form id="AddPrpductForm" method="post" action="/Auction/AddPrpductForm">
            <span class="rc-tp"><span></span></span>
            <div class="hd">
                <h3>
                    填写宝贝基本信息</h3>
            </div>
            <div class="bd">
                <div class="bd-sub">
                    <div id="product-info">
                        g;
                        <h5>
                            产品信息</h5>
                        <div class="detail">
                            <ul>
                                <li>类目：男装&gt;&gt;衬衫
                                    <input id="J_ReCategory" onclick="chgCat();chgNumber(); this.form.target='_self';"
                                        data-name="event_submit_do_re_select_category" value="编辑类目" class="J_DetectTrigger"
                                        data-detect="reEditCat" type="submit">
                                    <input id="cat" name="cat" value="@ViewData["cat"].ToString()" type="hidden" />
                                </li>
                            </ul>
                        </div>
                        <div class="detail" id="J_product-info">
                        </div>
                    </div>
                </div>
                <!-- end bd-sub -->
                
                <div class="bd-main">
                    <div>
                        <h5>
                            1. 宝贝基本信息
                        </h5>
                        <div class="form">
                            <ul id="J_form">
                                @if (Model != null)
                                {
                                    <li id="itemproperties" class="spubox">
                                        <label>
                                            宝贝属性：</label>
                                        <span>
                                            <div id="J_module-property" class="module-property module-form ">
                                                <div class="skin">
                                                    <dl class="hint propertymsg">
                                                        <dd>
                                                            填错宝贝属性，可能会引起宝贝下架，影响您的正常销售。请认真准确填写</dd>
                                                    </dl>
                                                    <ul>
                                                        @foreach (var item in Model)
                                                        {

                                                            var pName = @item.PropertyName.PName;
                                                            var pNo = @item.PropertyName.PNo;
                                                            if (item.PropertyName.PorpertyType == Enter.Config.EnumProductPorpertyType.Brand)
                                                            {
                                                           
                                                            
                                                            <li name="keySpus">
                                                                <label for="prop_20000" class="label-title">
                                                                    @pName：</label>
                                                                <span><em>*</em>
                                                                    <ul class="J_ul-single J_is-mainprop ul-select">
                                                                        <li>
                                                                            <select name="brand" id="brand">
                                                                                <option value=""></option>
                                                                                @foreach (var vitem in item.PropertyValues)
                                                                                {
                                                                                    var vName = @vitem.VName;
                                                                                    var vNo = @vitem.VNO;
                                                                                    if (vitem.Selected)
                                                                                    {
                                                                                    <option selected="selected" value="@vNo">@vName</option>
                                                                                    }
                                                                                    else
                                                                                    {
                                                                                    <option value="@vNo">@vName</option>
                                                                                    }


                                                                                }
                                                                            </select>
                                                                        </li>
                                                                    </ul>
                                                                </span></li>
                                                            
                                                            }
                                                            else if (item.PropertyName.PorpertyType == Enter.Config.EnumProductPorpertyType.Base)
                                                            {
                                                                if (item.PropertyName.chooseType == Enter.Mvc.Mall.Model.Product.PropertyModel.EnumchooseType.Input)
                                                                { 
                                                                
                                                            <li name="keySpus">
                                                                <label for="prop-@pNo" class="label-title">
                                                                    @pName：</label>
                                                                <span>
                                                                    <input  id="prop-@pNo" name="cp-@pNo" class="text text-short" type="text"/>
                                                                </span></li>
                                                                }
                                                                else if (item.PropertyName.chooseType == Enter.Mvc.Mall.Model.Product.PropertyModel.EnumchooseType.Radio)
                                                                { 
                                                            <li class="J_spu-property" id="spu-@pNo" name="spus">
                                                                <label class="label-title">
                                                                    @pName：</label>
                                                                <span>
                                                                    @if (item.PropertyName.IsRequired)
                                                                    {<em>*</em>}
                                                                    <ul class="J_ul-single ul-select">
                                                                        <li>
                                                                            <select name="cp-@pNo" id="prop-@pNo">
                                                                                <option selected="selected" value=""></option>
                                                                                @foreach (var vitem in item.PropertyValues)
                                                                                {
                                                                                    var vName = @vitem.VName;
                                                                                    var vNo = @vitem.VNO; 
                                                                                    <option value="@vNo">@vName</option>
                                                                                }
                                                                            </select>
                                                                        </li>
                                                                    </ul>
                                                                </span></li>
                                                                }
                                                                else if (item.PropertyName.chooseType == Enter.Mvc.Mall.Model.Product.PropertyModel.EnumchooseType.Multiple)
                                                                {
                                                            <li class="J_spu-property" id="spu-@pNo" name="spus">
                                                                <label class="label-title">
                                                                    @pName：</label>
                                                                <span>
                                                                    <ul class="J_ul-multi ul-checkbox">
                                                                        @foreach (var vitem in item.PropertyValues)
                                                                        {
                                                                            var vName = @vitem.VName;
                                                                            var vNo = @vitem.VNO; 
                                                                            <li>
                                                                                <input type="checkbox" name="cp-@pNo" value="@vNo" id="prop-@pNo"
                                                                                class="checkbox" /><label for="prop-@pNo-@vNo">@vName</label>
                                                                            </li>
                                                                        }
                                                                    </ul>
                                                                </span></li>

                                                                }
                                                            }

                                                        }
                                                    </ul>
                                                </div>
                                            </div>
                                        </span></li>
                               
                                    <li>
                                        <label for="TitleID">
                                            宝贝标题：</label>
                                        <span><em>*</em>
                                            <input id="TitleID" data-autogen="true" class="text text-long" name="Title" maxlength="60"
                                                size="30">
                                        </span></li>
                                    <li id="fixpriceOption2">
                                        <label for="buynow">
                                            一口价：</label>
                                        <span><em>*</em>
                                            <input class="text text-short" id="SalePRICE" maxlength="12" size="12" name="SalePRICE"
                                                type="text">
                                            元 </span></li>
                                    <li class="sku-style" id="J_SellProperties">
                                        @foreach (var item in Model)
                                        {
                                            if (item.PropertyName.PorpertyType == Enter.Config.EnumProductPorpertyType.Color)
                                            { 
                                            <div id="div_color" data-caption="颜色" class="sku-group  " data-features="image edit">
                                                <label class="sku-label">
                                                    颜色：</label>
                                                <div class="sku-box  sku-color">
                                                    <ul id="ul_color" class="sku-list">
                                                        @foreach (var vitem in item.PropertyValues)
                                                        {
                                                            var vName = @vitem.VName;
                                                            var vNo = @vitem.VNO;
                                                            var color = @vitem.Color;
                                                            var pNo = @vitem.PNo;
                                                            <li class="sku-item">
                                                                <input  class="J_Checkbox" name="ccp-@pNo" value="@pNo:@vNo" id="prop-@pNo-@vNo"
                                                                data-color="@color" data-thumb="@vName"  type="checkbox">
                                                                <label class="color-lump" style="background-color: #@color;" for="prop-@pNo-@vNo">
                                                                </label>
                                                                <label class="labelname" for="prop-@pNo-@vNo" title="@vName">
                                                                    @vName</label>
                                                                <input id="J_Alias-@pNo-@vNo" class="editbox text" maxlength="15" value="@vName"
                                                                name="ccpva-@pNo:@vNo" type="text">
                                                            </li>
                                                        }
                                                        <li>
                                                            <input id="chkall-c" class="J_CheckAll" type="checkbox">
                                                            <label class="sku-all" for="chkall-c">
                                                                全选</label>
                                                        </li>
                                                    </ul>
                                                    <table id="J_SKUImgTable" class="J_SKUImgTable img-table" style="display: none;"
                                                        border="0" cellspacing="0">
                                                        <caption>
                                                            颜色属性图片上传表格
                                                        </caption>
                                                        <thead>
                                                            <tr>
                                                                <th>
                                                                    颜色
                                                                </th>
                                                                <th>
                                                                    图片（无图片可不填）
                                                                </th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            @foreach (var vitem in item.PropertyValues)
                                                            {
                                                                var vName = @vitem.VName;
                                                                var vNo = @vitem.VNO;
                                                                var color = @vitem.Color;
                                                                var pNo = @vitem.PNo;
                                                             
                                                                <tr id="J_MapImg-@pNo-@vNo" style="display: none;">
                                                                    <td class="tile">
                                                                        <i class="color-lump" style="background-color: #@color;"></i><span class="J_Map-@pNo-@vNo">
                                                                            @vName</span>
                                                                    </td>
                                                                    <td>
                                                                        <input name="cpvf-@pNo:@vNo" type="file">
                                                                    </td>
                                                                </tr>
                                                            }
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>
                                            }
                                            else if (item.PropertyName.PorpertyType == Enter.Config.EnumProductPorpertyType.Size)
                                            {
                                              
                                            <div data-caption="尺码" class="sku-switchable sku-group  " data-features=" edit">
                                                <label class="sku-label">
                                                    尺码：</label>
                                                <div data-caption="尺码" class="sku-subgroup" data-features="edit">
                                                    <div class="sku-box  ">
                                                        <ul class="sku-list">
                                                            @foreach (var vitem in item.PropertyValues)
                                                            {
                                                                var vName = @vitem.VName;
                                                                var vNo = @vitem.VNO;
                                                                var color = @vitem.Color;
                                                                var pNo = @vitem.PNo;
                                                                <li class="sku-item  ">
                                                                    <input class="J_Checkbox" data-thumb="@vName" name="scp-@pNo" value="@pNo:@vNo" id="prop-@pNo-@vNo"
                                                                    type="checkbox">
                                                                    <label class="labelname" for="prop-@pNo-@vNo" title="@vName">
                                                                        @vName</label>
                                                                    <input id="J_Alias-@pNo-@vNo" class="editbox text" maxlength="15" value="@vName"
                                                                    name="scpva-@pNo:@vNo" type="text">
                                                                </li>
                                                            }
                                                        </ul>
                                                    </div>
                                                </div>
                                            </div>
                                            }
                                        }
                                        <div class="sku-mapwrapper" >
                                            <div id="J_SKUMapContainer" class="sku-map" style="height: auto; width: auto; overflow: hidden; display:none">
                                                <table cellspacing="0" border="0" style="visibility: visible;">
                                                    <caption>
                                                        销售属性匹配表</caption>
                                                    <thead>
                                                       
                                                    </thead>
                                                    <tbody>
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </li>
                                }
                                <li id="quantityIdDiv">
                                    <label for="quantityId">
                                        宝贝数量：</label>
                                    <span><em>*</em>
                                        <input class="text text-shorter J_Quantity" name="STOCKS" value="1" id="quantityId"
                                            type="text">
                                        件 <span class="prop-tips">(请如实填写，买家付款后72小时内未发货，根据<a href="#" target="_blank">淘宝规则</a>您可能被投诉和扣分，并赔偿金额给买家)
                                        </span></span></li>
                                <li id="outerDiv">
                                    <label for="outerIdId">
                                        商家编码：</label>
                                    <span>
                                        <input class="text text-short" type="text">
                                    </span></li>
                                <li class="item-desc-diy">
                                    <label>
                                        宝贝描述：<em class="must-write" style="color: red;">*</em></label>
                                    <textarea style="width: 610px; height: 140px;"></textarea>
                                </li>
                                @{Html.RenderAction("productuploadImg");}
                            </ul>
                        </div>
                        <h5 id="otherinfoTitle0">
                            4. 其他信息</h5>
                        <div class="form J_DetectTrigger" data-detect="otherInfo">
                            <ul>
                                <li>
                                    <label>
                                        开始时间：</label>
                                    <span id="J_publish-date">
                                        <ul class="ul-radio ul-radio-vertical">
                                            <li>
                                                <input checked="checked" class="radio" name="_now" type="radio">
                                                <label for="_now0">
                                                    立刻</label>
                                            </li>
                                            <li>
                                                <input class="radio" name="_now" value="1" id="_now1" type="radio">
                                                <span class="prop-tips" id="durainfo">您可以设定宝贝的正式开始销售时间</span> </li>
                                            <li>
                                                <input class="radio" name="_now" type="radio">
                                                <label for="inStock">
                                                    放入仓库</label>
                                            </li>
                                        </ul>
                                    </span></li>
                                <li>
                                    <label>
                                        有效期：</label>
                                    <span>
                                        <ul class="ul-radio">
                                            <li>
                                                <input class="radio" value="7" checked="checked" type="radio">
                                                <label for="durationId7">
                                                    7天</label>
                                            </li>
                                            <li>
                                                <input class="radio" name="_now" value="1" id="_now1" type="radio">
                                                <span class="prop-tips" id="durainfo">您可以设定宝贝的正式开始销售时间</span> </li>
                                        </ul>
                                    </span></li>
                            </ul>
                        </div>
                        <div class="submit">
                            <input type="submit" value="发布" class="btn" />
                            <input type="button" value="预览" class="btn" />
                        </div>
                    </div>
                </div>
                </form>
            </div>
        </div>
    </div>
</div>
